import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:test01/config/config.dart';
import 'package:test01/model/detail_info.dart';
import 'package:test01/model/picture.dart';
import 'package:test01/model/travel_info.dart';

class TravelContent extends StatefulWidget {
  var arguments;

  TravelContent(this.arguments, {Key? key}) : super(key: key);

  @override
  _TravelContentState createState() => _TravelContentState();
}

class _TravelContentState extends State<TravelContent> {
  int outId = 0;
  int classify = 0;
  TravelInfoItem _item = TravelInfoItem();
  List<PictureItem> _itemPicture = [];
  List<DetailInfoItem> _detailItem = [];

  @override
  void initState() {
    outId = widget.arguments["outId"];
    classify = widget.arguments["classify"];
    _getInfoPicture();
    _getTravelInfo();
    if (classify == 0) {
      _getAllDetailInfo();
    }
  }

  _getTravelInfo() async {
    var api = "${Config.domain}info/" + (classify==0 ? "getTravelInfo?id=$outId" : "getDetailInfo?id=$outId");
    var result = await Dio().get(api);
    var travelInfo = TravelInfo.fromJson(result.data);
    if (mounted) {
      setState(() {
        _item = travelInfo.data!;
      });
    }

  }

  _getAllDetailInfo() async {
    var api = "${Config.domain}info/getAllDetailInfo?outId=$outId";
    var result = await Dio().get(api);
    var allDetailItemList = DetailInfo.fromJson(result.data);
    if (mounted) {
      setState(() {
        _detailItem = allDetailItemList.data!;
      });
    }
  }

  _getInfoPicture() async {
    var api = "${Config.domain}info/getPicture?id=$outId&&classify=$classify";
    var result = await Dio().get(api);
    var pictureItemList = Picture.fromJson(result.data);
    if (mounted) {
      setState(() {
        _itemPicture = pictureItemList.data!;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        Container(
            child: ListView(
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              children: [
                _buildPicture(),
                _buildTitle(),
                _buildAllDetailItem()
              ],
            )
        )
      ],
    );
  }

  Widget _buildPicture() {
    if (_itemPicture.isNotEmpty) {
      return Container(
        padding: EdgeInsets.all(20.w),
        width: 710.w,
        height: 400.h,
        child: ListView(
          shrinkWrap: true,
          scrollDirection: Axis.horizontal,
          children: _itemPicture.map((e) =>
              Image.network(
                e.picture!,
                width: 710.w,
                height: 400.h,
                fit: BoxFit.fill,
              )).toList(),
        ),
      );
    }
    else {
      return const Text("");
    }
  }

  Widget _buildChip() {
    if (_item.rank!=null) {
      return Chip(
        label: Text(_item.rank!),
        backgroundColor: Colors.greenAccent,
        shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(20.w)),
      );
    }
    else {
      return const Text("");
    }
  }

  Widget _buildTitle() {
    if (_item.id != null) {
      return Container(
        margin: EdgeInsets.only(left: 20.w, right: 20.w),
        padding: EdgeInsets.all(20.w),
        color: Colors.white,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
                children: [
                  Icon(Icons.drive_file_rename_outline, size: 35.w,
                    color: Colors.red,),
                  Container(
                    margin: EdgeInsets.only(left: 20.w),
                    child: Text(_item.name!, style: TextStyle(
                        fontSize: 32.w, color: Colors.red),),
                  ),
                ]

            ),
            Row(
              children: [
                Icon(
                  Icons.add_location,
                  size: 20.w,
                  color: Colors.black26,
                ),
                Text(
                  _item.place!,
                  style: TextStyle(fontSize: 22.w, color: Colors.black26),
                )
              ],
            ),
            _buildChip(),
            Container(
              child: Text(_item.description!,
                style: TextStyle(fontSize: 25.w, color: Colors.black87),),
            ),
          ],
        ),
      );
    }
    else {
      return const Text("");
    }

  }

  Widget _buildAllDetailItem() {
    if (_detailItem.isNotEmpty) {
      return Column(
        children: [
          Container(
            padding: EdgeInsets.all(20.w),
            alignment: Alignment.center,
            child: Text("景区·景点", style: TextStyle(color: Colors.redAccent, fontSize: 32.w),),
          ),
          Container(
            width: 710.w,
            // height: 360.h,
            child: ListView(
              shrinkWrap: true,
              physics: const NeverScrollableScrollPhysics(),
              children: _detailItem.map((e) => GestureDetector(
                onTap: () {
                  Navigator.pushNamed(context, "/travel", arguments: {
                    "outId": e.detailId,
                    "classify": 1
                  });
                },
                child: Container(
                  padding: EdgeInsets.all(20.w),
                  decoration: const BoxDecoration(
                      color: Colors.white,
                  ),
                  width: 710.w,
                  // alignment: Alignment.centerLeft,
                  child: Column(
                    children: [
                      Row(
                          children: [
                            Icon(Icons.drive_file_rename_outline, size: 35.w,
                              color: Colors.red,),
                            Container(
                              margin: EdgeInsets.only(left: 20.w),
                              child: Text(e.title!, style: TextStyle(
                                  fontSize: 32.w, color: Colors.red),),
                            ),
                          ]
                      ),
                      Row(
                        children: [
                          Icon(
                            Icons.add_location,
                            size: 20.w,
                            color: Colors.black26,
                          ),
                          Text(
                            e.place!,
                            style: TextStyle(fontSize: 22.w, color: Colors.black26),
                          )
                        ],
                      ),
                      Container(
                        child: Text(e.description!, maxLines: 2, overflow: TextOverflow.ellipsis,
                          style: TextStyle(fontSize: 25.w, color: Colors.black87),),
                      ),
                    ],
                  ),
                ),
              )).toList(),
            ),
          ),
        ],
      );
    }
    else {
      return const Text("");
    }
  }
}
